<template>
  <div class="box">
    <div class="left">
      <left></left>
    </div>
    <div class="center">
      <center></center>
    </div>
    <div class="right">
      <right></right>
    </div>
  </div>
</template>

<script>
import left from './left/left.vue'
import center from './center/center.vue'
import right from './right/right.vue'

import moment from 'moment';
import DateList from './provide/dateList.js'
export default {
  components: { left, center, right },
  data() {
    return {
      dateList: new DateList()
    }
  },
  created() {
    // console.log('index------1', this.dateList)
  },
  provide() {
    return {
      dateList: this.dateList
    }
  }

}
</script>

<style scoped>
.box {
  display: flex;
  justify-content: space-between;
}

.left,
.center,
.right {
  width: 32%;
  height: 200px;
  border: 1px solid blue;
}
</style>